<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>分类</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="fenlei.css"/>
    <script src="bootstrap-3.3.5-dist/jquery-2.0.3.js"></script>
</head>
<body>
<section class="wrapper">
    <header>
        <a class="kuohao" href="xiaomishouye.html"><div class="left"></div></a>
        <p>商品分类</p>
        <a href="sousuo.html"><div class="right"></div></a>
    </header>
    <section class="container">
        <h3>手机/平板/电话卡</h3>
        <ul>
            <li>
                <a href="#"><div><img src="image/fl1.png"/></div><p>小米5</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/fl2.png"/></div><p>小米4S</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/fl1.png"/></div><p>小米5</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/fl2.png"/></div><p>小米4S</p></a>
            </li>
        </ul>
        <ul>
            <li>
                <a href="#"><div><img src="image/fl1.png"/></div><p>小米5</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/fl2.png"/></div><p>小米4S</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/fl1.png"/></div><p>小米5</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/fl2.png"/></div><p>小米4S</p></a>
            </li>
        </ul>
        <ul>
            <li>
                <a href="#"><div><img src="image/fl1.png"/></div><p>小米5</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/fl2.png"/></div><p>小米4S</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/fl1.png"/></div><p>小米5</p></a>
            </li>
        </ul>
    </section>
    <section class="container">
        <h3>电视/盒子</h3>
        <ul>
            <li>
                <a href="#"><div><img src="image/dians.png"/></div><p>小米电视43"</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/dians1.png"/></div><p>小米电视48"</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/dians.png"/></div><p>小米电视43"</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/dians1.png"/></div><p>小米电视48"</p></a>
            </li>
        </ul>
        <ul>
            <li>
                <a href="#"><div><img src="image/dians.png"/></div><p>小米电视43"</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/dians1.png"/></div><p>小米电视48"</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/dians.png"/></div><p>小米电视43"</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/dians1.png"/></div><p>小米电视48"</p></a>
            </li>
        </ul>
        <ul>
            <li>
                <a href="#"><div><img src="image/dians.png"/></div><p>小米电视43"</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/dians1.png"/></div><p>小米电视48"</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/dians.png"/></div><p>小米电视43"</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/dians1.png"/></div><p>小米电视48"</p></a>
            </li>
        </ul>
    </section>
    <section class="container">
        <h3>智能硬件/路由器</h3>
        <ul>
            <li>
                <a href="#"><div><img src="image/pj1.png"/></div><p>净水器/滤芯</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/pj2.png"/></div><p>净水器/滤芯</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/phc.png"/></div><p>九号平衡车</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/zh.png"/></div><p>智能家庭组合</p></a>
            </li>
        </ul>
        <ul>
            <li>
                <a href="#"><div><img src="image/pj1.png"/></div><p>净水器/滤芯</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/pj2.png"/></div><p>净水器/滤芯</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/phc.png"/></div><p>九号平衡车</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/zh.png"/></div><p>智能家庭组合</p></a>
            </li>
        </ul>
        <ul>
            <li>
                <a href="#"><div><img src="image/pj1.png"/></div><p>净水器/滤芯</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/pj2.png"/></div><p>净水器/滤芯</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/phc.png"/></div><p>九号平衡车</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/zh.png"/></div><p>智能家庭组合</p></a>
            </li>
        </ul>
    </section>
    <section class="container">
        <h3>移动电源/插线板/电池</h3>
        <ul>
            <li>
                <a href="#"><div><img src="image/dy.png"/></div><p>小米移动电源</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/cb.png"/></div><p>插线板</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/dc.png"/></div><p>电池</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/cdq.png"/></div><p>充电器</p></a>
            </li>
        </ul>
        <ul>
            <li>
                <a href="#"><div><img src="image/xc.png"/></div><p>线材</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/yddy.png"/></div><p>品牌移动电源</p></a>
            </li>
        </ul>
    </section>
    <section class="container">
        <h3>耳机/音箱/存储卡</h3>
        <ul>
            <li>
                <a href="#"><div><img src="image/lyej.png"/></div><p>蓝牙耳机</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/lyej.png"/></div><p>蓝牙耳机</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/lyej.png"/></div><p>蓝牙耳机</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/lyej.png"/></div><p>蓝牙耳机</p></a>
            </li>
        </ul>
        <ul>
            <li>
                <a href="#"><div><img src="image/cck.png"/></div><p>存储卡</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/cck.png"/></div><p>存储卡</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/cck.png"/></div><p>存储卡</p></a>
            </li>
        </ul>
    </section>
    <section class="container">
        <h3>小米生活方式</h3>
        <ul>
            <li>
                <a href="#"><div><img src="image/fz.png"/></div><p>服装</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/mt.png"/></div><p>米兔</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/fz.png"/></div><p>服装</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/mt.png"/></div><p>米兔</p></a>
            </li>
        </ul>
        <ul>
            <li>
                <a href="#"><div><img src="image/fz.png"/></div><p>服装</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/mt.png"/></div><p>米兔</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/fz.png"/></div><p>服装</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/mt.png"/></div><p>米兔</p></a>
            </li>
        </ul>
        <ul>
            <li>
                <a href="#"><div><img src="image/fz.png"/></div><p>服装</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/mt.png"/></div><p>米兔</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/fz.png"/></div><p>服装</p></a>
            </li>
        </ul>
    </section>
    <section class="container">
        <h3>保护类配件</h3>
        <ul>
            <li>
                <a href="#"><div><img src="image/bht.png"/></div><p>保护套/保护壳</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/tm.png"/></div><p>贴膜</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/hg.png"/></div><p>后盖</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/tz.png"/></div><p>贴纸</p></a>
            </li>
        </ul>
    </section>
    <section class="container" style="margin-bottom: 1.2rem">
        <h3>优惠套装</h3>
        <ul>
            <li>
                <a href="#"><div><img src="image/dytz.png"/></div><p>电源套装</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/yjtz.png"/></div><p>智能硬件套装</p></a>
            </li>
            <li>
                <a href="#"><div><img src="image/lxtz.png"/></div><p>旅行箱套装</p></a>
            </li>
        </ul>
    </section>
</section>
<footer>
    <ul>
        <li><a href="xiaomishouye.html"><div class="sc"></div><p>商城</p></a></li>
        <li><a href="#"><div class="fl"></div><p class="ys">分类</p></a></li>
        <li><a href="gouwuche.html"><div class="gwc"></div><p>购物车</p></a></li>
        <li><a href="fuwu.html"><div  class="fw"></div><p>服务</p></a></li>
    </ul>
</footer>
</body>
<script>
    $(function(){
        function fullwidth(){
            if($('body').width() >= 720){
                $('html').css('font-size',100 + 'px');
                return;
            }
            var scale = $('body').width() / 720;
            $('html').css('font-size',scale * 100 + 'px');
        }
        fullwidth();
        $(window).resize(function(){
            fullwidth()
        });
    });
</script>
</html>